import React, { Component } from 'react';
import { inject, observer } from 'mobx-react';
import { WeaSearchGroup, WeaFormItem, WeaLocaleProvider, WeaDialog } from 'ecCom';
import CarConstant from '../../../util/CarConstant';
import { WeaSwitch } from 'comsMobx';
import { Button, Modal } from 'antd';

const getLabel = WeaLocaleProvider.getLabel;
@inject('carTypeStore')
@observer
export default class CarTypeDialog extends Component {
  constructor(props) {
    super(props);
    this.state = { visible: false, title: '' };
    this.add = this.add.bind(this);
    this.edit = this.edit.bind(this);
    this.saveOrUpdateCarType = this.saveOrUpdateCarType.bind(this);
    this.hideDialog = this.hideDialog.bind(this);
  }

  componentDidMount() {
    const { carTypeStore } = this.props;
    carTypeStore.initCarTypeForm();
  }

  hideDialog() {
    this.setState({ visible: false });
  }
  add() {
    const { carTypeStore } = this.props;
    carTypeStore.reinitializeForm(carTypeStore.conditioninfo);
    this.setState({ visible: true, title: getLabel(385834, '新增车辆类型') });
  }
  edit() {
    this.setState({ visible: true, title: getLabel(93, '编辑') + getLabel(17630, '车辆类型') });
  }
  saveOrUpdateCarType() {
    const { carTypeStore } = this.props;
    const { form } = carTypeStore;

    form.validate().then((f) => {
      if (f.isValid) {
        carTypeStore.saveOrUpdateCarType(form.getFormParams(), this.hideDialog);
      } else {
        f.showErrors();
        Modal.warning({
          title: getLabel(15172, '系统提示'),
          content: getLabel(383975, '必要信息不完整，红色标记为必填项！'),
        });
      }
    });
  }
    submitAndAdd=() => {
      const { carTypeStore } = this.props;
      const { form } = carTypeStore;

      form.validate().then((f) => {
        if (f.isValid) {
          carTypeStore.saveOrUpdateCarType(form.getFormParams(), this.refreshForm);
        } else {
          f.showErrors();
          Modal.warning({
            title: getLabel(15172, '系统提示'),
            content: getLabel(383975, '必要信息不完整，红色标记为必填项！'),
          });
        }
      });
    }

    refreshForm=() => {
      const { carTypeStore } = this.props;
      const { form } = carTypeStore;
      form.clear();
    }

    render() {
      const { carTypeStore } = this.props;
      const { conditioninfo, form } = carTypeStore;
      const { isFormInit } = form;
      const group = [];
      isFormInit && conditioninfo.map((c, i) => {
        const items = [];
        c.items.map((fields, index) => {
          items.push({
            com: (<div style={index == 1 ? { paddingTop: '20px' } : {}}><WeaFormItem
              ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@dyrmvb@${fields.domkey[0]}`}
              label={`${fields.label}`}
              labelCol={{ span: `${fields.labelcol}` }}
              //   error={form.getError(fields)}
              wrapperCol={{ span: `${fields.fieldcol}` }}
            >
              <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@kros6o@${fields.domkey[0]}`} fieldConfig={fields} form={form} />
            </WeaFormItem></div>),
            colSpan: 1,
            hide: fields.label == 'id',
          });
        });
        group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@1kudv4@${i}`} col={1} needTigger={false} title={c.title} showGroup={c.defaultshow} items={items} />);
      });

      const id = form.getFormParams().id;
      return (
        <div>
          <WeaDialog
            ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@l6x55o`}
            className="car"
            style={{ height: '250px' }}
            icon={CarConstant.iconClassName}
            iconBgcolor={CarConstant.iconBgColor}
            title={this.state.title}
            visible={this.state.visible}
            onCancel={this.hideDialog}
            buttons={id ? [
              <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@x80arl@saveOrUpdateCarType`} type="primary" onClick={this.saveOrUpdateCarType}>{getLabel(86, '保存')}</Button>,
              <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@r47lip@close`} type="primary" onClick={this.hideDialog}>{getLabel(309, '关闭')}</Button>,
            ] : [
              <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@f7o0mg@saveOrUpdateCarType`} type="primary" onClick={this.saveOrUpdateCarType}>{getLabel(86, '保存')}</Button>,
              <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@f4zrze@submitAndAdd`} type="primary" onClick={this.submitAndAdd}>{getLabel(32720, '保存并新建')}</Button>,
              <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@sg31p0@hideDialog`} type="primary" onClick={this.hideDialog}>{getLabel(309, '关闭')}</Button>,
            ]}
          >
            {group}
          </WeaDialog>
        </div>
      );
    }
}
